<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	${emp.empName }
	${emp.postSetting.postName }
	<div id="zxy_ei_panel" class="easyui-panel">
		<div id="zxy_ei_emp_info">
			<div id="zxy_ei_emp_info1">
				<h3 class="zxy_ei_info_box_title">概览</h3>
				<div class="zxy_ei_emp_info_tools">
					<a v-on:click="zxy_ei_edit1(zxy_ei_emp,$event)"
						class="zxy_ei_edit easyui-linkbutton"
						id="zxy_ei_edit1"
						data-options="iconCls:'icon-edit',plain:'true',width:'150'">编辑</a> 
					<a v-on:click="zxy_ei_save1(zxy_ei_emp,$event)"
						class="zxy_ei_save easyui-linkbutton"
						id="zxy_ei_save1"
						data-options="iconCls:'icon-save',plain:'true',width:'150'">保存</a> 
					<a v-on:click="zxy_ei_cancel1(zxy_ei_emp,$event)"
						class="zxy_ei_cacel easyui-linkbutton"
						id="zxy_ei_cancel1"
						data-options="iconCls:'icon-cancel',plain:'true',width:'150'">取消</a>
				</div>
				<div class="zxy_ei_info_box">
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">员工编号:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empId}}</span> 
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empId" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">员工姓名:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empName}}</span>
						<input id="zxy_ei_emp_name_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empName" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">英文姓名:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.englishName}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.englishName" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">部门:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.dep.depName}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.dep.depName" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">职务:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.postSetting.postName}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.postSetting.postName" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">职级:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.rankSetting.rankName}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.rankSetting.rankName" />
					</div>
				</div>
				<div class="zxy_ei_info_box">
					<div id="zxy_ei_photo">
						<img v-bind:src="edit_zxy_ei_emp.photo" onerror="this.src='../common/img/default.jpg'" width="200px" height="200px" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">制单人:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.maker}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.maker" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">制单时间:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.makeTime}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.makeTime" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">更新人:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.updateEmp}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.updateEmp" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">更新时间:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.updateTime}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.updateTime" />
					</div>
				</div>
			</div>
			<div id="zxy_ei_emp_info2">
				<h3 class="zxy_ei_info_box_title">基本信息</h3>
				<div class="zxy_ei_emp_info_tools">
					<a v-on:click="zxy_ei_edit2(zxy_ei_emp,$event)"
						class="zxy_ei_edit easyui-linkbutton"
						id="zxy_ei_edit2"
						data-options="iconCls:'icon-edit',plain:'true',width:'150'">编辑</a> 
					<a v-on:click="zxy_ei_save2(zxy_ei_emp,$event)"
						class="zxy_ei_save easyui-linkbutton"
						id="zxy_ei_save2"
						data-options="iconCls:'icon-save',plain:'true',width:'150'">保存</a> 
					<a v-on:click="zxy_ei_cancel2(zxy_ei_emp,$event)"
						class="zxy_ei_cacel easyui-linkbutton"
						id="zxy_ei_cancel2"
						data-options="iconCls:'icon-cancel',plain:'true',width:'150'">取消</a>
				</div>
					
					
				<div class="zxy_ei_info_box">
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">性别:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.sexSetting.sex}}</span> 
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.sexSetting.sex" />
					</div>
					
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">身份证号:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.idCard}}</span>
						<input id="zxy_ei_emp_name_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.idCard" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">生日:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.birthday}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.birthday" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">最高学历:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.educationSetting.education}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.educationSetting.education" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">入职日期:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.hireDate}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.hireDate" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">转正日期:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.correctedDate}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.correctedDate" />
					</div>
				</div>
				<div class="zxy_ei_info_box">
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">政治面貌:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.politicalSetting.political}}</span> 
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.politicalSetting.political" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">健康状况:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.healthSetting.health}}</span>
						<input id="zxy_ei_emp_name_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.healthSetting.health" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">离职日期:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.resignDate}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.resignDate" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">国籍:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.nationality}}</span> <input
							id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.nationality" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">民族:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.nationSetting.nation}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.nationSetting.nation" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">婚姻状况:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empDetailInfo.maritalStatus}}</span>
						<input id="zxy_ei_emp_id_input" type="text" readonly="true"
							disabled="true" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empDetailInfo.maritalStatus" />
					</div>
				</div>
			</div>
			
			<div id="zxy_ei_emp_info3">
				<h3 class="zxy_ei_info_box_title">通讯信息</h3>
				<div class="zxy_ei_emp_info_tools">
					<a v-on:click="zxy_ei_edit3(zxy_ei_emp,$event)"
						class="zxy_ei_edit easyui-linkbutton"
						id="zxy_ei_edit3"
						data-options="iconCls:'icon-edit',plain:'true',width:'150'">编辑</a> 
					<a v-on:click="zxy_ei_save3(zxy_ei_emp,$event)"
						class="zxy_ei_save easyui-linkbutton"
						id="zxy_ei_save3"
						data-options="iconCls:'icon-save',plain:'true',width:'150'">保存</a> 
					<a v-on:click="zxy_ei_cancel3(zxy_ei_emp,$event)"
						class="zxy_ei_cacel easyui-linkbutton"
						id="zxy_ei_cancel3"
						data-options="iconCls:'icon-cancel',plain:'true',width:'150'">取消</a>
				</div>
				<div class="zxy_ei_info_box">
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">电话1:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.tel1}}</span> 
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.tel1" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">电话2:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.tel2}}</span>
						<input id="zxy_ei_emp_name_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.tel2" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">邮箱:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.email}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.email" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">传真:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.fax}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.fax" />
					</div>
					
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">现住址:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.currentAddress}}</span> <input
							id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.currentAddress" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">紧急联系人:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.contactPerson}}</span>
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.contactPerson" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">紧急联系人电话:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.contactTel}}</span>
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.contactTel" />
					</div>
				</div>
				<div class="zxy_ei_info_box">
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">邮政编码:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.postalCode}}</span> 
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.postalCode" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">国家:</span> 
						<span class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.country}}</span>
						<input id="zxy_ei_emp_name_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.country" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">省:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.province}}</span> <input
							id="zxy_ei_english_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.province" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">城市:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.city}}</span> <input
							id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.city" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">区:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.district}}</span>
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.district" />
					</div>

					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">街道:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.street}}</span>
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.street" />
					</div>
					
					<div class="zxy_ei_info_item">
						<span class="zxy_ei_info_title">地址:</span> <span
							class="zxy_ei_info_content">{{zxy_ei_emp.empCommunicationInfo.address}}</span>
						<input id="zxy_ei_emp_id_input" type="text" class="zxy_ei_info_input"
							v-model="edit_zxy_ei_emp.empCommunicationInfo.address" />
					</div>
				</div>
			</div>
		</div>
	</div>

	<input id="zxy_ui_empId" type="hidden" value="${empId}" />

	<link type="text/css" rel="stylesheet"
		href="../zxy/css/emp_info/emp_info.css" />
	<script src="../zxy/js/emp_info/emp_info.js"></script>
	<script>
		var zxy_ei_emp;
		var edit_zxy_ei_emp;
		var empId = $("#zxy_ui_empId").val();
		console.log("empId:" + empId);
		zxy_ei_get_emp_info(empId);
		function deepCopy(obj){
		    if(typeof obj != 'object'){
		    	if(obj==null){
		    		return "";
		    	}
		        return obj;
		    }
		    var newobj = {};
		    for ( var attr in obj) {
		        newobj[attr] = deepCopy(obj[attr]);
		    }
		    return newobj;
		}
		function zxy_ei_get_emp_info(empId) {
			$.ajax({
				url : "../emp/findEmpById",
				data : {
					"empId" : empId
				},
				success : function(data) {
					console.log("获取员工数据");
					zxy_ei_emp = data;
					edit_zxy_ei_emp = deepCopy(data);
					console.log(zxy_ei_emp);
					var zxy_ei_emp_info = new Vue({
						el : "#zxy_ei_emp_info",
						data : {
							zxy_ei_emp : zxy_ei_emp,
							edit_zxy_ei_emp : edit_zxy_ei_emp,
						},
						methods : {
							zxy_ei_edit1 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(1,2);
							},
							zxy_ei_edit2 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(2,2);
							},
							zxy_ei_edit3 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(3,2);
							},
							zxy_ei_save1 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(1,1);
							},
							zxy_ei_save2 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(2,1);
							},
							zxy_ei_save3 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(3,1);
							},
							zxy_ei_cancel1 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(1,1);
								this.edit_zxy_ei_emp=this.zxy_ei_emp;
							},
							zxy_ei_cancel2 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(2,1);
								this.edit_zxy_ei_emp=this.zxy_ei_emp;
							},
							zxy_ei_cancel3 : function(zxy_ei_emp, event) {
								this.zxy_ei_edit(3,1);
								this.edit_zxy_ei_emp=this.zxy_ei_emp;
							},
							//根据code和model的值决定那个部分的编辑/保存/取消按钮和输入框需要隐藏或显示
							zxy_ei_edit:function(code,mode){
								var zxy_ei_edit_str='#zxy_ei_edit'+code;
								var zxy_ei_save_str='#zxy_ei_save'+code;
								var zxy_ei_cancel_str='#zxy_ei_cancel'+code;
								var zxy_ei_emp_info_str='#zxy_ei_emp_info'+code;
								if(mode==1){
									$(zxy_ei_edit_str).css("display","block");
									$(zxy_ei_save_str).css("display","none");
									$(zxy_ei_cancel_str).css("display","none");
									$(zxy_ei_emp_info_str+" .zxy_ei_info_input").css("display","none");
									$(zxy_ei_emp_info_str+" .zxy_ei_info_content").css("display","block");
								}
								else{
									$(zxy_ei_edit_str).css("display","none");
									$(zxy_ei_save_str).css("display","block");
									$(zxy_ei_cancel_str).css("display","block");
									$(zxy_ei_emp_info_str+" .zxy_ei_info_input").css("display","block");
									$(zxy_ei_emp_info_str+" .zxy_ei_info_content").css("display","none");
									
								}
							},
						},
					})
				},
				error : function() {
					console.log('error');
				}
			});
		}

		/* function zxy_ei_show_emp_info(zxy_ei_emp){
			alert(zxy_ei_emp.empName);
		} */
	</script>
</body>
</html>